﻿<!doctype html>
<html xmlns:th="http://www.thymeleaf.org" xmlns="http://www.w3.org/1999/html">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
  <title>也许有用 技术论坛 - MAYBE IT WORKS</title>
  <link th:href="@{/show/css/bootstrap.min.css}" type="text/css" rel="stylesheet">
  <link th:href="@{/show/css/style.css}" type="text/css" rel="stylesheet">
  <link type="text/css" th:href="@{/show/css/nprogress.css}" rel="stylesheet">
<!--[if lt IE 9]>
    <script src="js/html5shiv.min.js" type="text/javascript"></script>
    <script src="js/respond.min.js" type="text/javascript"></script>
    <script src="js/selectivizr-min.js" type="text/javascript"></script>
<![endif]-->
  <link rel="icon" th:href="@{/show/images/icon/favicon.ico}" type="image/x-icon"/>
  <link rel="bookmark" th:href="@{/show/images/icon/favicon.ico}" type="image/x-icon"/>
  <link rel="stylesheet" th:href="@{/layui/css/layui.css}">
  <link rel="stylesheet" th:href="@{/show/css/imgSizeSmall.css}">
  <script th:src="@{/layui/layui.js}"></script>
<meta name="Keywords" content="" />
<meta name="description" content="" />
  <style>
    .title1  ul{
      list-style-type: none;
      padding: 0px;
      float: left;
      position: relative;
    }
    .title1 ul li {
      width: 110px;
      height: 56px;
      text-align: center;
      float: left; }
    .title1 ul li a {     color: #848789;
      font-size: 18px;
      text-decoration: none;
      line-height: 56px; }
    .title1 ul a:hover{     color:  #0ab2d2; }
    .title1 .move{     height: 4px;
      width: 110px;
      border-top: 4px solid  #0ab2d2;/*只需要将上边显示出来*/
      position: absolute;
      left: 0;
      top: 52px;
      transition: left .2s ease-in-out 0s;/*包含四个过度属性：执行变换属性、执行时间、速率、延迟*/
      -webkit-transition: left .2s ease-in-out 0s;/*chrome和safari*/
      -moz-transition: left .2s ease-in-out 0s;/*firefox*/
      -o-transition: left .2s ease-in-out 0s;/*opera*/ }
    li:nth-child(1):hover~ .move{    /*li元素的父元素的第一个子元素，当鼠标停留其上时，move元素的left属性改变*/
      left: 0px; }
    li:nth-child(2):hover~ .move{     left: 110px; }
    li:nth-child(3):hover~ .move{     left: 220px; }
  </style>
</head>

<body>
<section class="container user-select">
  <header>
    <div class="hidden-xs header"><!--超小屏幕不显示-->
      <h1 class="logo"> <a th:href="@{/show/main}" title="异清轩技术博客 - POWERED BY WY ALL RIGHTS RESERVED"></a> </h1>
      <ul class="nav hidden-xs-nav">
        <li class="active"><a href=""><img class="contentDiv" th:src="@{/upload/userimg/}+${wallet.getAvatar()}"><input type="hidden" id="uid" name="uid" th:value="${user.getUserId()}" /><b th:text="${user.getUserAccount()}"></b></a></li>
        <li><a href=""><span class="glyphicon glyphicon-globe"></span>IP属地：<font style="" th:text="${user.getIpHome()}"></font></a></li>
        <li><a href=""><span class="glyphicon glyphicon-erase"></span>等级<img th:src="@{/show/images/grade/Grade_}+${wallet.getGrade()}+'.png'" /></a></li>
        <li><a href=""><span class="glyphicon glyphicon-inbox"></span>文章数：<b th:text="${statistic.getArticlenum()}"></b></a></li>
        <li><a href=""><span class="glyphicon glyphicon-signal"></span>总排名：<B th:text="${rank}"></B></a></li>
        <li><a href=""><span class="glyphicon glyphicon-sunglasses"></span>访问量：<B th:text="${statistic.getHits()}"></B></a></li>
        <li><a href=""><span class="glyphicon glyphicon-ice-lolly-tasted"></span>积分：<B th:text="${wallet.getPrice()}"></B></a></li>
        <li><a href=""><span class="glyphicon glyphicon-heart"></span>粉丝：<B th:text="${follow}"></B></a></li>
        <li><a href=""><span class="glyphicon glyphicon-thumbs-up"></span>获赞：<B th:text="${statistic.getZan()}"></B></a></li>
        <li><a href=""><span class="glyphicon glyphicon-comment"></span>评论：<B th:text="${statistic.getCommentsNum()}"></B></a></li>
        <li th:if="${session.loginUser!=null && session.loginUser.getUserId==user.getUserId()}">
          <a th:href="@{/user/index}"><span class="glyphicon glyphicon-tasks"></span>博客管理</a>
        </li>
      </ul>
      <input id="sex" type="hidden" th:value="${wallet.getSex()}">
      <div class="feeds" th:if="${session.loginUser==null || session.loginUser.getUserId!=user.getUserId()}">
      	<a id="follow" class="feed feed-xlweibo">
          <i></i><input id="iffollow" type="hidden" th:value="${iffollow}">
          <font th:if="${iffollow == 'no'}">关注</font>
          <font th:if="${iffollow == 'yes'}">已关注</font>
        </a>
        <a class="feed feed-txweibo" id="feed"  target="_blank">
          <i></i>私信</a>
      </div>

    </div>
    <!--/超小屏幕不显示-->
    <div class="visible-xs header-xs"><!--超小屏幕可见-->
      <div class="navbar-header header-xs-logo">
        <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#header-xs-menu" aria-expanded="false" aria-controls="navbar"><span class="glyphicon glyphicon-menu-hamburger"></span></button>
      </div>
      <div id="header-xs-menu" class="navbar-collapse collapse">
        <ul class="nav navbar-nav header-xs-nav">
          <li class="active"><a href="index.html"><span class="glyphicon glyphicon-home"></span>网站首页</a></li>
          <li><a href=""><span class="glyphicon glyphicon-erase"></span>网站前端</a></li>
          <li><a href=""><span class="glyphicon glyphicon-inbox"></span>后端技术</a></li>
          <li><a href=""><span class="glyphicon glyphicon-globe"></span>管理系统</a></li>
          <li><a href="about.html"><span class="glyphicon glyphicon-user"></span>关于我们</a></li>
          <li><a href="friendly.html"><span class="glyphicon glyphicon-tags"></span>友情链接</a></li>
        </ul>
        <form class="navbar-form" action="search.php" method="post" style="padding:0 25px;">
          <div class="input-group">
            <input type="text" class="form-control" placeholder="请输入关键字">
            <span class="input-group-btn">
            <button class="btn btn-default btn-search" type="submit">搜索</button>
            </span> </div>
        </form>
      </div>
    </div>
  </header>
  <!--/超小屏幕可见-->
  <div class="content-wrap"><!--内容-->
    <div class="content">
      <div class="content-block new-content">
        <div class="title1">
          <ul>
            <li><a id="boke" th:href="@{/userCenter/show/}+${user.getUserId()}">博客(<font th:text="${statistic.getArticlenum()}"></font>)</a></li>
            <li><a id="ziyuan" th:href="@{/userCenter/show/}+${user.getUserId()}+'?searchType=ziyuan'">资源</a></li>
            <li><a id="shoucang" th:href="@{/userCenter/show/}+${user.getUserId()}+'?searchType=shoucang'">收藏</a></li>
            <li class="move"> </li>
          </ul>
        </div>
        <div class="row" >
          <div class="news-list" th:if="${searchType=='boke'}" th:each="page:${articles}" >
            <div class="news-img col-xs-5 col-sm-5 col-md-4">
              <a target="_blank" th:href="@{/show/content/}+${page.getArticleId()}" >
                <img th:src="@{/show/images/logo.jpg}" alt="">
              </a>
            </div>
            <div class="news-info col-xs-7 col-sm-7 col-md-8">
              <dl >
                <dt> <a th:href="@{/show/content/}+${page.getArticleId()}" target="_blank" th:text="${page.getTitle()}"> 异清轩技术博客正式上线！ </a> </dt>
                <dd><span class="name"><a href="" th:text="${page.getAuthor()}" th:title="'由'+${page.getAuthor()}+'发布'" title="由 异清轩 发布" rel="author">异清轩</a></span> <span class="identity"></span> <span class="time" th:text="${#dates.format(page.getCreateTime(),'yyyy-MM-dd HH:mm:ss')}"> 2015-10-19 </span>&nbsp;&nbsp;&nbsp;<span th:if="${page.getTop =='1'}" class="glyphicon glyphicon-plane" style="color: #3399CC"></span></dd>
                <dd class="text" th:text="${page.getDescription()}">欢迎来到异清轩技术博客，在这里可以看到网站前端和后端的技术，还有CMS内容管理系统，包括但不限于这些还有CMS内容管理系统，包括但不限于这些。</dd>
              </dl>
              <div class="news_bot col-sm-7 col-md-8"> <span class="tags visible-lg visible-md" > <a href="" th:each="tag:${#strings.arraySplit(page.getTags(),';')}" th:text="${tag}">本站</a> </span> <span class="look"> 共 <strong th:text="${page.getHits()}">2126</strong> 人围观，发现 <strong th:text="${page.getHits()-page.getZan()}"> 12 </strong> 个不明物体 </span> </div>
            </div>
          </div>
          <div class="news-list" th:if="${searchType=='ziyuan'}" th:each="page:${datafiles}">
            <div class="news-img col-xs-3 col-sm-3 col-md-2" >
              <a target="_blank" th:href="@{/show/fileContent/}+${page.getFileId()}" >
                <img th:src="@{/show/images/filetype/}+${page.getType}+'.png'" alt="">
              </a>
            </div>
            <div class="news-info col-xs-7 col-sm-7 col-md-10">
              <dl >
                <dt> <a th:href="@{/show/fileContent/}+${page.getFileId()}" target="_blank" th:text="${page.getTitle()}"> 异清轩技术博客正式上线！ </a> </dt>
                <dd>
                   <span class="name">
                       <a href="" th:text="${page.getAuthor()}" th:title="'由'+${page.getAuthor()}+'发布'" title="由 异清轩 发布" rel="author">异清轩</a>
                   </span> <span class="identity"></span> <span class="time" th:text="${#dates.format(page.getCreateTime(),'yyyy-MM-dd HH:mm:ss')}"> 2015-10-19 </span>
                </dd>
                <dd class="text" th:text="${page.getDescription()}">欢迎来到异清轩技术博客，在这里可以看到网站前端和后端的技术，还有CMS内容管理系统，包括但不限于这些还有CMS内容管理系统，包括但不限于这些。</dd>
              </dl>
            </div>
          </div>
          <div class="news-list" th:if="${searchType=='shoucang'}">
            <ul th:each="collect:${collects}" class="layui-nav layui-nav-tree layui-bg-cyan layui-inline" lay-filter="demo" style="margin-right: 10px;width: 100%">
              <li class="layui-nav-item layui-nav-itemed">
                <a href="javascript:;" th:text="${collect.getKey()}">默认展开</a>
                <dl class="layui-nav-child" th:each="chart:${collect.getValue()}">
                  <dd><a th:href="@{/show/content/}+${chart.getAid}"><font th:text="${chart.getTitle()}"></font><i class="layui-icon" style="float: right;color: #0ab2d2;">&#xe658;</i></a></dd>
                </dl>
              </li>
            </ul>
          </div>
        </div>
        <!--<div class="news-more" id="pagination">
        	<a href="">查看更多</a>
        </div>
        <div class="quotes" style="margin-top:15px"><span class="disabled">首页</span><span class="disabled">上一页</span><span class="current">1</span><a href="">2</a><a href="">下一页</a><a href="">尾页</a></div>
      -->
      </div>
    </div>
  </div>
  <!--/内容-->
  <aside class="sidebar visible-lg"><!--右侧>992px显示-->
    <div class="sentence"> <strong>每日一句</strong>
      <h2 id="date">2015年11月1日 星期日</h2>
      <p id="selfwords">你是我人生中唯一的主角，我却只能是你故事中的一晃而过得路人甲。</p>
    </div>
    <div id="search" class="sidebar-block search" role="search">
      <h2 class="title"><strong>搜索</strong></h2>
      <form class="navbar-form">
        <div class="input-group">
          <input type="hidden" id="searchtype" th:value="${searchType}">
          <input id="userWords" name="userWords" th:value="${like}"  type="text" class="form-control" size="35" placeholder="请输入关键字">
          <span class="input-group-btn">
          <button id="user_words" class="btn btn-default btn-search" type="button">搜索</button>
          </span> </div>
      </form>
    </div>
    <div class="sidebar-block recommend">
      <h2 class="title"><strong>热门推荐</strong></h2>
      <ul th:each="article:${hots}">
        <li><a target="_blank" th:href="@{/show/content/}+${article.getArticleId()}"> <span class="thumb"><img th:src="@{/show/images/icon/icon.png}" alt=""></span> <span class="text" th:text="${article.getTitle()}">异清轩技术博客的SHORTCUT和ICON图标 ...</span> <span class="text-muted">阅读(<font th:text="${article.getHits()}"></font>)</span></a></li>
      </ul>
    </div>
    <div class="sidebar-block comment">
      <h2 class="title"><strong>最新评论</strong></h2>
      <ul>
        <li th:each="comment:${comments}" data-toggle="tooltip" data-placement="top" th:title="${comment.getAuthor()}+'的评论'">
          <a target="_blank" th:href="@{/show/content/}+${comment.getArticleId()}">
            <span class="face">
              <img th:src="@{/upload/userimg/}+${comment.getAvatar()}" alt="">
            </span>
            <span class="text">
              <strong th:text="${comment.getAuthor()}">异清轩站长</strong> (<font th:text="${#dates.format(comment.getCreateTime(),'yyyy-MM-dd HH:mm:ss')}">2015-10-18</font>) 说：<br />
              <p style="width:200px; white-space: nowrap; overflow: hidden;text-overflow: ellipsis;" th:text="${comment.getContent()}">欢迎来到异清轩技术博客，在这里可以看到网站前端和后端的技术等 ...</p>
            </span>
          </a>
        </li>
      </ul>
    </div>
  </aside>
  <!--/右侧>992px显示-->
  <footer class="footer" th:fragment="bottombar">POWERED BY &copy;<a href="http://39.107.119.38:8886/view/index">赵家宝 MyBlog.com</a> ALL RIGHTS RESERVED &nbsp;&nbsp;&nbsp;<span><a href="http://www.miitbeian.gov.cn/" target="_blank">豫ICP备15026801号-1</a></span> <span style="display:none"><a href="">网站统计</a></span> </footer>
</section>
<div><a href="javascript:;" class="gotop" style="display:none;"></a></div>
<!--/返回顶部-->
<script th:src="@{/show/js/jquery-2.1.4.min.js}" type="text/javascript"></script>
<script th:src="@{/show/js/nprogress.js}" type="text/javascript" ></script>
<script th:src="@{/show/js/bootstrap.min.js}" type="text/javascript"></script>
<script th:src="@{/show/js/comm/right.js}" type="text/javascript"></script>
<script type="text/javascript">
//页面加载
$('body').show();
$('.version').text(NProgress.version);
NProgress.start();
setTimeout(function() { NProgress.done(); $('.fade').removeClass('out'); }, 1000);
//返回顶部按钮
$(function(){
	$(window).scroll(function(){
		if($(window).scrollTop()>100){
			$(".gotop").fadeIn();	
		}
		else{
			$(".gotop").hide();
		}
	});
	$(".gotop").click(function(){
		$('html,body').animate({'scrollTop':0},500);
	});
});
//提示插件启用
$(function () {
  $('[data-toggle="popover"]').popover();
});
$(function () {
	$('[data-toggle="tooltip"]').tooltip();
});
//鼠标滑过显示 滑离隐藏
$(function(){
	$(".carousel").hover(function(){
		$(this).find(".carousel-control").show();
	},function(){
		$(this).find(".carousel-control").hide();
	});
});
$(function(){
	$(".hot-content ul li").hover(function(){
		$(this).find("h3").show();
	},function(){
		$(this).find("h3").hide();
	});
});
//页面元素智能定位
$.fn.smartFloat = function() { 
	var position = function(element) { 
		var top = element.position().top; //当前元素对象element距离浏览器上边缘的距离 
		var pos = element.css("position"); //当前元素距离页面document顶部的距离
		$(window).scroll(function() { //侦听滚动时 
			var scrolls = $(this).scrollTop(); 
			if (scrolls > top) { //如果滚动到页面超出了当前元素element的相对页面顶部的高度 
				if (window.XMLHttpRequest) { //如果不是ie6 
					element.css({ //设置css 
						position: "fixed", //固定定位,即不再跟随滚动 
						top: 0 //距离页面顶部为0 
					}).addClass("shadow"); //加上阴影样式.shadow 
				} else { //如果是ie6 
					element.css({ 
						top: scrolls  //与页面顶部距离 
					});     
				} 
			}else { 
				element.css({ //如果当前元素element未滚动到浏览器上边缘，则使用默认样式 
					position: pos, 
					top: top 
				}).removeClass("shadow");//移除阴影样式.shadow 
			} 
		}); 
	}; 
	return $(this).each(function() { 
		position($(this));                          
	}); 
}; 
//启用页面元素智能定位
$(function(){
	$("#search").smartFloat();
});
//异步加载更多内容
jQuery("#pagination a").on("click", function () {
    var _url = jQuery(this).attr("href");
    var _text = jQuery(this).text();
    jQuery(this).attr("href", "javascript:viod(0);");
    jQuery.ajax(
    {
        type : "POST",
        url : _url,
        success : function (data)
        {
            //将返回的数据进行处理，挑选出class是news-list的内容块
            result = jQuery(data).find(".row .news-list");
            //newHref获取返回的内容中的下一页的链接地址
            nextHref = jQuery(data).find("#pagination a").attr("href");
            jQuery(this).attr("href", _url);
            if (nextHref != undefined)
            {
                jQuery("#pagination a").attr("href", nextHref);
            }
			else
            {
                jQuery("#pagination a").html("下一页没有了").removeAttr("href")
            }
            // 渐显新内容
            jQuery(function ()
            {
                jQuery(".row").append(result.fadeIn(300));
                jQuery("img").lazyload(
                {
                    effect : "fadeIn"
                });
            });
        }
    });
    return false;
});

$("#user_words").click(function () {
  var words=$("#userWords").val();
  var uid=$("#uid").val();
  var searchType=$("#searchtype").val();
  window.location.href="/userCenter/show/"+uid+"?searchType="+searchType+"&words="+words;
});
$(function () {
  var type=$("#searchtype").val();
  if (type=="shoucang"){
    $("#shoucang").css("color","#0ab2d2")
  }else if (type=="ziyuan"){
    $("#ziyuan").css("color","#0ab2d2");
  }else {
    $("#boke").css("color","#0ab2d2");
  }
})
</script>
<script th:inline="javascript">
  layui.use('layer', function() {
    /*关注功能*/
    $("#follow").click(function () {
      var login = [[${session.loginUser}]];
      var iffollow = $("#iffollow").val();
      var fid = $("#uid").val();
      if (login == null) {
        layer.msg('请先登录！');
        return ;
      }else {
        window.location.href="/userCenter/follow/"+fid+"/"+iffollow;
      }
    });
    /*私信功能*/
    $("#feed").click(function () {
      var login = [[${session.loginUser}]];
      var iffollow = $("#iffollow").val();
      var id =$("#uid").val();
      if (login == null) {
        layer.msg('请先登录！');
        return ;
      }else if(iffollow=='no'){
        layer.msg('请先关注！');
        return ;
      }else {
        window.location.href="/Chat/toChat/"+id;
      }
    })
  });
  layui.use('element', function(){
      var element = layui.element; //导航的hover效果、二级菜单等功能，需要依赖element模块

      //监听导航点击
      element.on('nav(demo)', function(elem){
        //console.log(elem)
        /*layer.msg(elem.text());*/
      });
  });
</script>
<!--个性化-->
<!--小人-->
<script src="https://eqcn.ajz.miesnfu.com/wp-content/plugins/wp-3d-pony/live2dw/lib/L2Dwidget.min.js"></script>
<script th:src="@{/js/person.js}"></script>

</body>
</html>
